@import url("rem.less");
@import url("footer.less");
@width: 100%;
html,body{
    height: 100%;
}
.header{
    width: @width;
    background:url(../img/Order-imgs/order-img-banner.png) no-repeat;
    background-size:100% ;
    .h(770);
    .h-top{
        text-align: right;
        .pt(100);.pr(40);
        span{.fz(50);color: #fff;}
    }
    .h-bottom{
        text-align: center;
        .mt(200);
        p{
            width: @width;
            .fz(45);
            color: #fff;
        }
    }
}
.main{
   background: linear-gradient(#2bc6f6,#fff);
   .pl(30);
   .pr(30);
   .h(1290);
   .m-title{
       width:@width;
       .mt(85);
       .mb(40);
       border-top: 3px solid #358890;
       p{
           .fz(40);
           color: #358890;
           font-weight: bold;
           margin: auto;
           text-align: center;
           .mt(-30);
           background:#2bc6f6;
           .w(388);
       }
   }
   .login{
       text-align: center;
       .logon-btn{
           width: 100%;
           .h(120);
           border-radius: 3px;
           background: #ff9700;
           color: #fff;
           .fz(45);
           text-align: center;
           border: none;
       }
   }
   .contain{
       width: @width;
       .con-mend{
           position: relative;
           img{
               width: @width;
           }
           .mend-title{
               position: absolute;
               top: 50%;
               left: 50%;
               text-align: center;
               margin-left: -10%;
               margin-top: -10%;
               h4,p{
                    color: #fff;
                   font-weight: bold;
                   text-shadow: 5px 5px 5px #000 ;
                   letter-spacing: 2px;
                }
               h4{
                   .fz(70);
               }
               p{
                   .fz(40);
                   i{
                       .fz(40);
                   }
               }
           }
           .batch-btn{
               position: absolute;
               top: 2%;
               right:2%;
               .w(135);
               .h(50);
               text-align: 4;
               background: none;
               color: #fff;
               border:1px solid #fff;
               border-radius: 20px;
               .fz(25);
           }
       }
       .mend-opts-left{
           float: left;
           .h(530);
       }
       .mend-opts-right{
           float: right;
           .h(258);
           .mb(10);
       }
       .mend-opts-left,.mend-opts-right{
           width: 49%;
           position: relative;
           img{
               width: @width;
           }
           .mend-small-title{
               width: @width;
               position: absolute;
               bottom: 0;
               left: 0;
               display: flex;
               justify-content: space-between;
               .mendst_left,.mendst_right{
                   color: #fff;
               }
               .mendst_left{
                   .ml(24);
                   .mb(14);
                   h4{
                       .fz(36);
                       font-weight: bold;
                   }
                   p{
                       .fz(27)
                   }
               }
               .mendst_right{
                   .mt(22);
                   .mr(70);
                   h4{
                       .fz(32);
                       span{
                           .fz(22);
                       }
                   }
               }
           }
       }
   }
}
